/**
 * 节流
 * 在短时间内多次调用函数，不会全部触发，而是会按照规定的时间间隔来触发，稀释了函数的触发频率
 */
function throttle(fn, time) {
    clearTimeout(fn.timeId);
    fn.timeId = setTimeout(() => {
        fn()
    }, time);
}
let i = 0;
while(i < 10) {
    throttle(test, 200);
    // test();
    i++;
}

/**
 * 防抖
 * 防抖是在短时间内多次调用函数，不会全部触发，而是只会触发规定时间内的最后一次
 */
function debounce(fn, time) {
    // 不过这种写法会有执行上下文的问题，如果传入的函数内有使用this，这时this的指向就会指向这里
    // 所以要还要增加一个上下文的参数，fn.call(context)
    // 或者换一种写法，将这个函数return回去，回到其原本的作用域中执行
    if (fn.timeId) {
        clearTimeout(fn.timeId);
    }
    fn.timeId = setTimeout(() => {
        fn()
    }, time);
}

// let i = 0;
// while(i < 10) {
//     debounce(test, 1000);
//     // test();
//     i++;
// }

function test() {
    console.log('123')
}